/*
Template Name: ECSHOP Default
Template URI: http://www.ecshop.com/
Description: 默认升级版.
Version: 2.7.2
Author: ECSHOP Team
Author URI: http://www.ecshop.com/
Logo filename: logo.gif
Template Type: type_0
*/


/* ====================
     公共样式
==================== */
body{position:relative;background:#fff; font-size:12px; font-family:"宋体",Verdana, Arial; line-height:150%; margin:0 0 0 0; padding:0; color:#404040;}
div{margin:0 auto; padding:0;}
h1,h2,h3,h4,h5,h6,ul,li,dl,dt,dd,form,img,p, a,span,font{
margin:0; padding:0; border:none; list-style-type:none;
font-family:'Microsoft YaHei UI','Microsoft YaHei',DengXian,SimSun,'Segoe UI',Tahoma,Helvetica,sans-serif;
}
.block{
  width:1000px; height:auto;
}
.f_l{float:left;}
.banner-1{background:url(images/banner-background.jpg);width: 1000px;height: 148px;background-size: cover;}
.f_r{float:right;}
.tl{ text-align:left;}
.tc{ text-align:center;}
.tr{ text-align:right;}
.dis{display:block;}
.inline{display:inline;}
.none{display:none;}
.dashed{background:url(images/lineBg.gif) repeat-x left top; color:#3f3f3f;  padding:2px 0 3px 12px;}


.marquee_a {color:#333;}
.marquee_a:hover {color:#4fb75e;}
.clearfix:after{
content:"."; display:block; height:0; clear:both;
visibility:hidden;
}
*html .clearfix{
 height:1%;
}
*+html .clearfix{
 height:1%;
}
/*英文强制换行*/
.word{word-break:break-all;}

  /*边框*/
  .B_grey{border:1px solid #cecece;}
  .B_blue{border:1px solid #c5e4ff;}
  .B_input{border:1px solid #0f97ed;}
  .inputBg{border:1px solid #b3b3b3; background:url(images/inputbg.gif) repeat-x left top; height:18px;}
  /*字体颜色*/
  .f1{color:#ff6666;}
  .f2{color:#006bd0; font-weight:bold; margin-right:15px;}
  .f3{color:#9e9e9e;}
  .f4{color:#fe596a;}
  .f4_b{color:#fe596a; font-weight:bold;}
  .f5{ font-size:14px; font-weight:bold;}
  .f6{color:#006bd0;}
  .market{ font-size:14px; text-decoration:line-through;}
  .shop{color:#fe596a; font-size:14px; font-weight:600;}
  .market_s{text-decoration:line-through;}
  .shop_s{color:#fe596a;}
  /*按钮部分*/
  .bnt_blue{
  background:url(images/bg.gif) no-repeat 0px 0px; width:52px; height:21px;
  text-align:center; line-height:21px; color:#fff; border:none; cursor:pointer;
  }
  .bnt_blue_1{
  background:url(images/bg.gif) no-repeat 0px -663px; width:77px; height:21px;
  text-align:center; line-height:21px; color:#fff; border:none; cursor:pointer;
  }
  .bnt_blue_2{
  background:url(images/bg.gif) no-repeat 0px -696px; width:139px; height:21px;
  text-align:center; line-height:21px; color:#fff; border:none; cursor:pointer;
  }
  .bnt_bonus{
  background:url(images/bg.gif) no-repeat -56px 0px; width:52px; height:21px;
  text-align:center; line-height:21px; color:#fff; border:none; cursor:pointer;
  }
  /*模块容器*/
  .box{/*background:#f1f1f1;*/ padding-bottom:2px; overflow:hidden;}
  .box_1{border:1px solid #c5e4ff; background-color:#fff;}
  .box_2{border:1px solid #c5e4ff; background:url(images/box_2Bg.gif) repeat-x top left;
  background-color:#edf8fe;  overflow:hidden;
  }
  .boxCenterList{padding:0px;}
  
  
  
  #left_nav {
  border:1px solid #dddddd; padding: 2px 4px; border-radius:10px;
  font-family:'Microsoft YaHei UI','Microsoft YaHei',DengXian,SimSun,'Segoe UI',Tahoma,Helvetica,sans-serif;
  }
  #left_nav  table a{ 

  border-radius:3px;padding:1px;background-image:none;color: #666;
  }
  #left_nav  table a:hover{color:#000;color:#fd671d;}
  
  .box_1_1 {
  border:1px solid #dddddd; border-radius:3px;
  font-family:'Microsoft YaHei UI','Microsoft YaHei',DengXian,SimSun,'Segoe UI',Tahoma,Helvetica,sans-serif;
  }
  .box_1_1  table a{ 

  

  border-radius:3px;padding:1px;background-image:none;color: #666;
    -moz-transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  }
  .box_1_1  table a:hover{color:#000;border-radius:3px;}
  
  
  
  
  
  
  
  
.box_shadow_without_border {border:0px solid #dddddd; border-radius:3px;-webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.09);
-moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.09);
box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.09);}

.box_shadow {border:1px solid #dddddd; border-radius:10px;-webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.09);
-moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.09);
box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.09);}
.box_padding{padding:4px;}
.h3_title{color:#4fb75e;font-weight:700;}
._strong{font-weight:700;}  
.filter_a{text-decoration:none;padding:1px 4px;}
.filter_a:hover{color:#fd671d;}
.filter_selected{border-radius:5px;color:#fff;background-color:#4fb75e;padding:1px 4px;}
.filter_div{
float:left;display: block;width: 90px;
height: 22px;
line-height: 22px;
margin-top: 1px;
padding: 1px 10px 1px 6px;}




  /*模块标题*/
  h3{height:33px; line-height:33px; font-size:12px; text-align:right;
  padding:0 12px; font-weight:100;
  }
  h3.border{border:1px solid #c5e4ff; border-bottom:none;}
  h3 img{position:relative; top:7px;}
  h3 span{float:left; width:auto; height:33px; line-height:33px; text-align:left;
   font-weight:bold; color:#56a5ee; padding-left:12px;}
  h5{height:26px; line-height:26px; text-align:right; background-color:#edf7ff; font-size:12px;
  color:#56a5ee; padding:0 10px 0 0;
  }
  h5 span{float:left; font-weight:bold; background:url(images/bg.gif) no-repeat 0 -616px; padding-left:25px;}
  h6{height:23px; line-height:23px; text-align:right; font-size:12px; background:#edf7ff; color:#3f3f3f;
  border:1px solid #fff; padding-right:10px;
  }
  h6 span{float:left; padding-left:15px;}

  /*页面留白*/
  .blank{height:8px; line-height:8px; clear:both; visibility:hidden;}
  .blank5{height:5px; line-height:5px;/* _margin:-3px 0;*/ clear:both; visibility:hidden;}
  /*布局*/
  .AreaL{width:200px; float:left; margin-right:10px;}
  .AreaR{width:790px; float:left;}

  
  .banner_a {font-family:Meiryo;color:#333;}
  .banner_a:hover {color:#fa455a;}

  .cat-panel{
  margin:0 auto; width:1000px; 
}
  .cat-panel a{
	text-decoration:none;
	}
  .cat-panel a:hover{
	text-decoration:underline;
	}
  
  
  
  
  
  
  
/* ====================
     导航部分
==================== */
  /*顶部管理型导航*/
  .log{height:50px;width:100%;}
  .log{height:31px;width:100%;background-color:#dadada;}
  .log li{float:right;}
  .log .userInfo{*margin-right:10px; /*width:300px;*/ text-align:left;}
  .log .userInfo a{color:#006acd; text-decoration:none;}
  .log li img{position:relative; top:5px;}
  #topNav{
    height:31px;
    line-height:31px; color:#bebfc1; padding:0px 15px; margin:0px 10px; position:relative;
  }
  #topNav .topNavR{background:url(images/topNavR.gif) no-repeat; width:5px; height:31px;
  position:absolute; top:0px; right:0px;
  }
  #topNav a{color:#868485;text-decoration:none;}
  /*页面主导航*/
  #mainNav{width:1000px; background-color: #348e44;}
  #mainNav a{display:block; height:26p; float:left; line-height:26px; text-align:center;
  padding:0 15px; position:relative;
  margin-right:0px; color:#fff; text-decoration:none;font-family:"Tahoma";
  -moz-transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  }
  #mainNav a span{width:3px; height:26px; background-color: #348e44; 
  position:absolute; top:0px; right:0px;color:#09440e;font-family:"Tahoma";
  }
  #mainNav a:hover{background-color: #09440e;
  }
  #mainNav .cur{display:block; height:26px; float:left; line-height:26px; text-align:center;
  padding:0 15px; background-color: #0d5813; position:relative;
  margin-right:0px; color:#fff; text-decoration:none;
  }

  #mainNav a:hover span, #mainNav .cur span{height:26px; background-color: #348e44; 
  position:absolute; top:0px; right:0px;
  }














/*///////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////// slide show ////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////////////////////////*/
#make-main-banner-scroll
{
  width: 1500px;
  margin-left:-17.8%;
  height: 250px;
  position: relative;
}

/* Replace the last selector for the type of element you have in
your scroller. If you have div's use #make-main-banner-scroll div.scrollableArea div,
if you have links use #make-main-banner-scroll div.scrollableArea a and so on. */
#make-main-banner-scroll div.scrollableArea img
{
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  /* If you don't want the images in the scroller to be selectable, try the following
  block of code. It's just a nice feature that prevent the images from
  accidentally becoming selected/inverted when the user interacts with the scroller. */
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}

img.scrollingHotSpotLeft
{
  /* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
  background: rgba(255,255,255,0.6);
  transition: all 0.5s ease;
  width: 29px;
  height: 58px;
  top: 100px;
  /* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
  display: block;
  position: absolute;
  z-index: 200;
  left: 452px;
  /*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
  
}

img.scrollingHotSpotRight
{
  background: rgba(255,255,255,0.6);
  transition: all 0.5s ease;
  top: 100px;
  width: 29px;
  height: 58px;
  display: block;
  position: absolute;
  z-index: 200;
  left: 875px;
}

img.scrollingHotSpotRight:hover, img.scrollingHotSpotLeft:hover
{
  background: rgba(255,255,255,0.9);
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.scrollWrapper
{
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

div.scrollableArea
{
  position: relative;
  width: auto;
  height: 100%;
}
/*///////////////////////////////////////////////////////////////////////////////////////////////*/
/*//////////////////////////////////// end of slide show ////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////////////////////////*/





















/*////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////// every week selection-panel //////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////*/

#everyWeekSelection-panel{
  height:200px;
	width:1000px; background-color: #348e44;
}
#everyWeekSelection-panel a{
  color:#fff;
}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////// end of every week selection-panel ///////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/













.bottom-banner {
  height:50px;
  width:1000px; background-color: #999;}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////// vege-panel /////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/



/* vege slide show */
#make-vege-banner-scroll
{
  width: 1300px;
  margin-left:-200px;
  height: 250px;
  position: relative;
}

/* Replace the last selector for the type of element you have in
your scroller. If you have div's use #make-main-banner-scroll div.scrollableArea div,
if you have links use #make-main-banner-scroll div.scrollableArea a and so on. */
#make-vege-banner-scroll div.vege-scrollableArea img
{
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  /* If you don't want the images in the scroller to be selectable, try the following
  block of code. It's just a nice feature that prevent the images from
  accidentally becoming selected/inverted when the user interacts with the scroller. */
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}

img.vege_scrollingHotSpotLeft
{
  /* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
  
  transition: all 0.5s ease;
  width: 29px;
  height: 58px;
  top: 100px;
  /* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
  display: block;
  position: absolute;
  z-index: 200;
  left: 0px;
  /*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
  
}

img.vege_scrollingHotSpotRight
{
  
  transition: all 0.5s ease;
  top: 100px;
  width: 29px;
  height: 58px;
  display: block;
  position: absolute;
  z-index: 200;
  left: 590px;
}

img.vege-scrollingHotSpotRight:hover, img.vege-scrollingHotSpotLeft:hover
{
 
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.vege-scrollWrapper
{
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

div.vege-scrollableArea
{
  position: relative;
  width: auto;
  height: 100%;
}

/* end of vege slide show */


/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////// end of vege-panel ////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/







/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////// fruit-panel /////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/



/* fruit slide show */
#make-fruit-banner-scroll
{
  width: 1300px;
  margin-left:-200px;
  height: 250px;
  position: relative;
}

/* Replace the last selector for the type of element you have in
your scroller. If you have div's use #make-main-banner-scroll div.scrollableArea div,
if you have links use #make-main-banner-scroll div.scrollableArea a and so on. */
#make-fruit-banner-scroll div.fruit-scrollableArea img
{
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  /* If you don't want the images in the scroller to be selectable, try the following
  block of code. It's just a nice feature that prevent the images from
  accidentally becoming selected/inverted when the user interacts with the scroller. */
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}

img.fruit_scrollingHotSpotLeft
{
  /* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
  
  transition: all 0.5s ease;
  width: 29px;
  height: 58px;
  top: 100px;
  /* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
  display: block;
  position: absolute;
  z-index: 200;
  left: 0px;
  /*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
  
}

img.fruit_scrollingHotSpotRight
{
  
  transition: all 0.5s ease;
  top: 100px;
  width: 29px;
  height: 58px;
  display: block;
  position: absolute;
  z-index: 200;
  left: 590px;
}

img.fruit-scrollingHotSpotRight:hover, img.fruit-scrollingHotSpotLeft:hover
{
 
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.fruit-scrollWrapper
{
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

div.fruit-scrollableArea
{
  position: relative;
  width: auto;
  height: 100%;
}

/* end of fruit slide show */

/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////// end of fruit-panel ////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/











/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*//////////////////////////////////////////// meat-panel /////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/

#meat-panel{
  margin:0 auto; width:1000px; 
}



/* meat slide show */
#make-meat-banner-scroll
{
  width: 1300px;
  margin-left:-200px;
  height: 250px;
  position: relative;
}

/* Replace the last selector for the type of element you have in
your scroller. If you have div's use #make-main-banner-scroll div.scrollableArea div,
if you have links use #make-main-banner-scroll div.scrollableArea a and so on. */
#make-meat-banner-scroll div.meat-scrollableArea img
{
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  /* If you don't want the images in the scroller to be selectable, try the following
  block of code. It's just a nice feature that prevent the images from
  accidentally becoming selected/inverted when the user interacts with the scroller. */
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}

img.meat_scrollingHotSpotLeft
{
  /* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
  
  transition: all 0.5s ease;
  width: 29px;
  height: 58px;
  top: 100px;
  /* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
  display: block;
  position: absolute;
  z-index: 200;
  left: 0px;
  /*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
  
}

img.meat_scrollingHotSpotRight
{
  
  transition: all 0.5s ease;
  top: 100px;
  width: 29px;
  height: 58px;
  display: block;
  position: absolute;
  z-index: 200;
  left: 590px;
}

img.meat-scrollingHotSpotRight:hover, img.meat-scrollingHotSpotLeft:hover
{
 
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.meat-scrollWrapper
{
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

div.meat-scrollableArea
{
  position: relative;
  width: auto;
  height: 100%;
}

/* end of meat slide show */

/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////// end of meat-panel ////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/





/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////// wok-panel /////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/

#wok-panel{
  margin:0 auto; width:1000px; 
}




/* wok slide show */
#make-wok-banner-scroll
{
  width: 1300px;
  margin-left:-200px;
  height: 250px;
  position: relative;
}

/* Replace the last selector for the type of element you have in
your scroller. If you have div's use #make-main-banner-scroll div.scrollableArea div,
if you have links use #make-main-banner-scroll div.scrollableArea a and so on. */
#make-wok-banner-scroll div.wok-scrollableArea img
{
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  /* If you don't want the images in the scroller to be selectable, try the following
  block of code. It's just a nice feature that prevent the images from
  accidentally becoming selected/inverted when the user interacts with the scroller. */
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}

img.wok_scrollingHotSpotLeft
{
  /* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
  
  transition: all 0.5s ease;
  width: 29px;
  height: 58px;
  top: 100px;
  /* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
  display: block;
  position: absolute;
  z-index: 200;
  left: 0px;
  /*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
  
}

img.wok_scrollingHotSpotRight
{
  
  transition: all 0.5s ease;
  top: 100px;
  width: 29px;
  height: 58px;
  display: block;
  position: absolute;
  z-index: 200;
  left: 590px;
}

img.wok-scrollingHotSpotRight:hover, img.wok-scrollingHotSpotLeft:hover
{
 
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.wok-scrollWrapper
{
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

div.wok-scrollableArea
{
  position: relative;
  width: auto;
  height: 100%;
}

/* end of wok slide show */

/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////// end of wok-panel ////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/


/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////// shaidan-panel /////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/

#test-panel{
  margin:0 auto; width:1000px; 
}
#test-panel a{
  color:#fff;
}
.re_men_title, .re_men_desc{text-decoration:none;}
.re_men_title:hover, .re_men_desc:hover{text-decoration:underline;}
.re_men_title{color:#005EA7;font-size:0.9em;}
.re_men_desc{color:#999;font-size:0.8em;}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////// end of shaidan-panel ////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/




  /*搜索*/
  #search{border:1px solid #5cb4e6; background:url(images/searchBg.gif) repeat-x left top; width:918px;
  padding:0px 20px; height:36px; line-height:36px;
  }
  #search a{color:#fff; text-decoration:none;}
  #search .keys{background:url(images/bg.gif) no-repeat 0 -28px;
  color:#fff; padding-left:40px;
  }
  #search .go{background:url(images/bnt_search.gif); border:none; width:52px; height:19px;/* position:relative; top:2px; utf8下*/}
  /*当前位置*/
  #ur_here{
height: 36px;
line-height: 36px;
padding: 0 12px;
font-family: 'Microsoft YaHei UI','Microsoft YaHei',DengXian,SimSun,'Segoe UI',Tahoma,Helvetica,sans-serif;
}
  
  #ur_here  a{color:#666; text-decoration:none;}

/* ====================
     模块
==================== */
   /*购物车*/
   .cart{background:url(images/catBg.gif) no-repeat left top; padding:15px 10px 15px 50px;
   color:#006bcd; height:50px;  _padding:12px 10px 15px 50px;
   }
   .cart a{color:#006bcd; text-decoration:none;}
   .cart a:hover{color:#006bcd; text-decoration:underline;}
   /*商品分类*/
   #category_tree{border:4px solid #f1faff; background-color:#fff;}
   #category_tree dl{margin:6px;}
   #category_tree dt{background:url(images/lineBg.gif) repeat-x left bottom;
   color:#3f3f3f;  padding:2px 0 3px 12px;
   }
   #category_tree dt a{background:url(images/bg.gif) no-repeat 0 -69px;
   color:#3f3f3f; padding-left:15px; text-decoration:none;
   }
   #category_tree dd{padding:3px 0 3px 10px;}
   #category_tree dd a{color:#404040; text-decoration:none;}
   #category_tree dd a:hover{color:#ff6600; text-decoration:none;}
   /*销售排行*/
   .top10Tit{background:url(images/bg.gif) no-repeat 0px -85px; height:30px;}
   .top10List{border:1px solid #d7ecfd; background-color:#fff; margin:0px 4px 4px 4px;}
	 .top10List ul{border-bottom:1px solid #e2f3fd; position:relative;}
	 .top10List .iteration{position:absolute; top:6px; left:6px;}
	 .top10List .iteration1{padding-left:3px;}
	 .top10List li.topimg{width:35px; height:35px;}
	 .top10List .samllimg{width:35px; height:35px; margin-bottom:4px;}
   .top10List li{padding:3px 3px 3px 23px; float:left;}
   /*linkCOLOR*/
   .top10List li a,#mallNews .NewsList li a,.boxCenterList li a{color:#3f3f3f; text-decoration:none;}
   .top10List li a:hover,#mallNews .NewsList li a:hover,.boxCenterList li a:hover{color:#ff6600; text-decoration:none;}
   /*首页焦点图*/
   #focus{border-right:1px solid #c5e4ff; padding:8px; background:url(images/foucsBg.gif) repeat-x left top;}
   #mallNews{width:230px; padding:8px 8px 0px 8px; background:url(images/foucsBg.gif) repeat-x left top;}
   #mallNews .NewsTit{background:url(images/bg.gif) 0px -132px; height:23px;}
   #mallNews .NewsList{background:#FFFFFF; padding:8px;}
   #mallNews .NewsList ul{margin-top:10px;}
   #mallNews .NewsList li{background:url(images/bg.gif) no-repeat 0px -167px; padding:0px 0px 0px 10px;
   text-align:left;
   }
   /*今日特价和品牌*/
   #sales{width:500px; background:url(images/salesBg.gif) repeat-x left bottom;
   border-bottom:2px solid #f0f1f3; background-color:#eef8ff;
   }
   #sales h1{font-size:12px; background:url(images/salesTitBg.gif) no-repeat; height:33px; text-align:right;}
   #sales h1 img{position:relative; top:10px; right:8px;}
   #sales .goodBox{margin:10px 0px 10px 10px; _margin-left:5px;}
     #sales .goodBox .goodList p{text-align:left; color:#3f3f3f;}
     #sales .goodBox .goodList p a{color:#3f3f3f; text-decoration:none;}
   #sales .goodBox .goodList p a:hover{color:#ff6600; text-decoration:none;}
   #sales .goodList{width:110px; margin:0px 5px 0px 5px; float:left;}
   #sales .goodList img{background:url(images/salesGoodBg.gif) no-repeat; width:100px; height:100px; padding:5px;
   }
   #sales .goodList p{ margin-top:3px; text-align:center;}
   #brands{width:247px; height:199px; *height:201px; padding:1px 0 0 1px; position:relative;}
   #brands .brandsMore{position:absolute; left:178px; bottom:10px;
   width:65px; height:41px;
   }
   #brands .brandsMore img{border:none; width:65px; height:41px;}
   #brands img{width:78px; height:40px;border:1px solid #c5e4ff;}
   #brands a{color:#0069cd; text-decoration:none; margin:2px 1px; display:block; float:left;}
     .brandsIe6{_width:250px;}/*在ie6下特价商品不存在的话品牌推荐永远靠右显示*/
   /*精品推荐，新品上市，热卖商品*/
   .centerPadd{padding:5px 8px 8px 8px; overflow:hidden;}
   .itemTit{height:30px; background:url(images/bg.gif) no-repeat 0px -195px; padding-left:190px; text-align:right;
   /*margin-bottom:-3px; _margin-bottom:-2px;*/
   }
   .itemTit.New{background:url(images/bg.gif) no-repeat 0px -225px;}
   .itemTit.Hot{background:url(images/bg.gif) no-repeat 0px -256px;}
   .itemTit img{position:relative; top:7px;}
   .itemTit h2{float:left; height:27px; background:url(images/itemH2Bg.gif) repeat-x left top; border:1px solid #d6ecff;
   font-size:12px; text-align:center; color:#3f3f3f; font-weight:100; padding:0px 10px; line-height:28px; margin:0 6px 0 0;
   border-bottom:none; position:relative; bottom:-3px; display:inline; white-space:nowrap;
   }
   .itemTit h2 a{color:#3f3f3f; text-decoration:none;}
   .itemTit .h2bg{height:27px; line-height:28px; border:none; background:none;
   font-size:12px; text-align:center; color:#006ace; font-weight:100; padding:0px 10px;
     display:inline; white-space:nowrap;
   }
   .itemTit .h2bg a{color:#006ace; text-decoration:none;}
   .centerPadd .goodsBox{border:1px solid #d6ecff; background:#fff; padding:12px 0px 0px 17px; *padding:12px 0px 0px 17px;
   _padding:12px 0px 0px 0px;}
   .centerPadd .goodsBox .more{text-align:right; clear:both; margin:0 8px 8px 0;}
       /*单个商品*/
       .goodsItem{width:190px; float:left; position:relative; overflow:hidden; margin:0px 2.5px 11px 2.5px;border:1px solid #cecece;-moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;}
	   .goodsItem:hover {border:1px solid #4fb75e;-webkit-box-shadow: 0px 0px 5px 2px rgba(168,168,168,.8);
-moz-box-shadow: 0px 0px 5px 2px rgba(168,168,168,.8);
box-shadow: 0px 0px 5px 2px rgba(168,168,168,.8);}
.goodsItem:hover .goods_action li a{ color:#fff;background-color:#4fb75e;border-right:1px solid #41934c;border-top: 1px solid #41934c;}
.goodsItem:hover .goods_action li:last-child a{border-right: none;}
       .goodsimg{width:100px; height:100px; border:0px solid #eef8ff; margin-bottom:4px;}
       .goodsItem img{}
	   .boxCenterList li.goodsimg_original{width:48px; height:50px;margin-right: 10px;}
	   .goodsimg_original img{width:48px; height:48px; display:block;margin-right: 10px;text-align:center;}
	   .goodsimg_original li{text-align:center;width: 120px;}
       .goodsItem p{text-align:left; color:#3f3f3f;}
       .goodsItem p a{color:#3f3f3f; text-decoration:none;}
       .goodsItem p a:hover{color:#ff6600; text-decoration:none;}
       .goodsItem span{width:40px; height:40px; position:absolute;left:0px; top:0px;}
       .goodsItem span.best{background:url(images/bg.gif) no-repeat 0px -304px;}
       .goodsItem span.news{background:url(images/bg.gif) no-repeat -75px -304px;}
       .goodsItem span.hot{background:url(images/bg.gif) no-repeat -161px -304px;}
	   .goods_action{
		  position: absolute;height: 36px;bottom: 0;-moz-transition: all 0.1s ease-in-out;
		  -webkit-transition: all 0.1s ease-in-out;
		  -o-transition: all 0.1s ease-in-out;
		  transition: all 0.1s ease-in-out;
		  }
	   .goods_action li{float: left;height: 36px;margin: 0;}
	   .goods_action li a{display: block;
			float: left;
			width: 45px;
			height: 35px;
			border-top: 1px solid #E5E5E5;
			border-right: 1px solid #DADADA;
			line-height: 33px;
			background: #F6F6F6;
			text-align: center;
			text-decoration: none;
			margin-top:0px;
			font-size:1em;
			color:#333;
		
			}
			.goods_action li:last-child a {border-right: none;}
			.goods_action li a:hover {
				color:#fff;
			}
			.goods_action li a:hover .goods_action li a{
			
			}
			.goods_action_div_wrapper {overflow: hidden;height:35px;
			position:relative; width:100%;
		  }
			.goods_action_div_wrapper_container{position:absolute; width:100%; top:0;-moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;}
  
	.goods_action_div_wrapper_container div{width:100%;height:35px;}
		  
		  .goods_action li a:hover .goods_action_div_wrapper_container{
				top:-35px;
			}
   /*帮助*/
   .helpTitBg{background:url(images/helpTitBg.gif) repeat-x left top; text-align:left; border:1px solid #c5e4ff; background-color:#fff;
   padding:0 0 10px 15px;
   }
   .helpTitBg dl{float:left; margin-right:30px; _margin-right:20px; _width:130px;}
   .helpTitBg dt{background:url(images/bg.gif) no-repeat 0px -570px;width:auto; height:33px; line-height:33px; text-align:left;
   font-weight:bold; color:#56a5ee; padding-left:12px; margin-bottom:8px;}
     .helpTitBg dt a{font-weight:bold; color:#56a5ee; text-decoration:none;}
   .helpTitBg dd a{color:#006acd; text-decoration:none; background:url(images/bg.gif) no-repeat 0px -170px; padding:0px 0px 0px 10px;}

   /*相关商品*/
   .boxCenterList ul{height:1%; margin-bottom:5px;}
   .boxCenterList li{float:left; width:120px;}
   .boxCenterList li.goodsimg{width:48px; margin-right:10px;}
   .boxCenterList li.goodsimg img{width:48px; height:48px; display:block;}
   /*相关文章(其它带有小三角点的文字列表共用)*/
   .RelaArticle a,.alone{ text-decoration:none;}
   .RelaArticle a:hover{text-decoration:none;}
   /*浏览历史，收藏*/
   .history h2{height:26px; line-height:26px; padding:0px 10px 0 20px; text-align:center; font-size:12px;
   background:url(images/bg.gif) no-repeat 0px -466px; float:left; color:#57a7f0;
   margin:6px 5px 0 0; border:1px solid #c5e3ff; border-bottom:none; background-color:#FFFFFF;
   }
   .history .h2bg{height:26px; line-height:26px; padding:0px 10px 0 20px; text-align:center; font-size:12px;
   background:url(images/bg.gif) no-repeat 0px -508px; float:left; color:#a0a0a0;
   margin:6px 5px 0 0; border:none;
   }
     #history li{width:100%;}
		 #clear_history a{background:none; padding:0px; color:#3f3f3f; text-decoration:none;float:right;cursor:pointer;}
   .colle a{background:none; padding:0px; color:#3f3f3f; text-decoration:none;}
   .colle a:hover{background:none; padding:0px; color:#ff6600; text-decoration:none;}
   /* ====================
     商品详情页面部分模块
==================== */
   #goodsInfo{background:#f2f2f2; padding:8px; _height:1%;}
   #goodsInfo .imgInfo{width:230px; float:left; margin-right:10px; overflow:hidden;}
   #goodsInfo .imgInfo .thumb{width:230px; height:230px; display:block;}/*商品详情图片*/
   #goodsInfo span{width:4px; height:48px; background:url(images/bg.gif) no-repeat 0 -527px; float:left;}
   #goodsInfo span.spanR{width:4px; height:48px; background:url(images/bg.gif) no-repeat -5px -527px; float:right;}
   #goodsInfo .gallery{width:204px; float:left; margin-left:10px; _margin-left:5px; overflow:hidden;}
   #goodsInfo .gallery ul{width:auto;}
   #goodsInfo .gallery li{float:left; width:48px; margin:0 2px;}
   #goodsInfo .gallery li img{width:46px; height:46px; display:block;}
   /*文字信息*/
   #goodsInfo .textInfo{background:#fff; width:473px; float:left; padding:10px;}
   #goodsInfo .textInfo p{font-size:14px; font-weight:bold; padding:0 5px 5px 8px;}
   #goodsInfo .textInfo ul{border-top:1px solid #ccc;}
   #goodsInfo .textInfo li{background:url(images/lineBg.gif) repeat-x left bottom; padding:0px 8px; _height:1%;}
   #goodsInfo .textInfo li.padd{padding:7px 0px 7px 8px;}
   #goodsInfo .textInfo li dd{width:50%; float:left; padding:7px 0px;}
   #goodsInfo .textInfo li dd.ddR{border-left:1px solid #eeecec; width:48%; padding-left:8px;}
     #goodsInfo .textInfo li dd.ddL{border-right:1px solid #eeecec;}
   #goodsInfo .textInfo a{color:#006bce; text-decoration:underline;}
   #goodsInfo .textInfo .loop{background:#f7f7f7; margin-top:8px;}
   /*用户评论*/
   .ie6{padding-left:25px; _padding-left:15px; height:1%;}/*购买此商品的人还购买的商品*/
   .comments li{background:url(images/lineBg.gif) repeat-x left bottom;  width:97%; _height:1%; text-align:left; position:relative;
   margin-bottom:8px;
   }
   .comments li img{position:absolute; right:0px; top:3px;}
   .comments li p{margin:3px auto; text-align:left;}
   .commentsList{}
   .commentsList .inputBorder{border:1px solid #ccc; background:#fff;}
     .captcha{margin-left:0px; position:relative; top:-1px; *margin-left:8px; *position:relative; top:3px; cursor:pointer;}
	 .comment_box{padding: 20px 15px;}
	 


  

.comment_submit {
	
	
	background-color:#44c767;
	-moz-border-radius:17px;
	-webkit-border-radius:17px;
	border-radius:17px;
	border:1px solid #09A61C;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:'Microsoft YaHei UI','Microsoft YaHei',DengXian,SimSun,'Segoe UI',Tahoma,Helvetica,sans-serif;
	font-size:12px;
	font-weight:bold;
	padding:5px 15px;
	text-decoration:none;
	text-shadow:0px 1px 5px #2f6627;
	
	-moz-transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.comment_submit:hover {
	background-color:#09A61C;
}
.comment_submit:active {
	position:relative;
	top:1px;
}


    /* ====================
     品牌推荐
==================== */
    /*品牌列表*/
    #brandList{background:url(images/brandBg.gif) repeat-y top center; margin-top:12px; height:1%;}
    #brandList .brandBox{width:240px; _width:236px; float:left; margin:0 5px 20px 5px; text-align:center; overflow:hidden; height:160px;}
        #brandList .brandBox .brandLogo{width:188px; height:52px; overflow:hidden;}
    #brandList .brandBox h4{height:23px; line-height:23px; background:#e9e9e9; margin:15px 0 8px 0; padding:0 10px; text-align:right;
    font-weight:100; font-size:12px;
    }
    #brandList .brandBox h4 span,#brandList .brandBox h4 span a{float:left; font-weight:bold; color:#3f3f3f; text-decoration:none;}
    #brandList p{text-align:left; margin-bottom:5px; color:#909090; padding:8px;}
    #brandList p.brandCategory,#brandList p.brandCategory a{text-align:left; color:#006acd; text-decoration:none;}
    #brandList .brandArticle{border:1px dashed #d9d9d9; background:#f8f8f8; text-align:left;}
    .brandCategoryA a{ margin-right:15px;}

    /* ====================
     用户中心
==================== */
    .box_1 .userCenterBox{border:4px solid #f1faff; background-color:#fff;}
    .usBox{background:#f2f2f2; border:1px solid #e2e2e2; padding:15px; width:928px;}
    .usBox_1{background:#fff; text-align:left; width:297px; height:208px; padding:43px 153px 60px 123px;}
    .usBox_1 .logtitle{height:30px; background:url(images/ur_bg.gif) no-repeat 0px 0px;}
    .us_Submit{border:none; width:115px; height:40px; background:url(images/bnt_ur_log.gif);}
    .us_Submit_reg{border:none; width:113px; height:40px; background:url(images/bnt_ur_reg.gif);}
    .usTxt{width:265px; height:267px; padding:43px 0 0 90px; background:#f2f2f2; float:right;
    text-align:left; background:url(images/ur_bg1.gif) no-repeat 0 50%; line-height:23px;
    }
    .usTxt img{margin-top:15px;}
    /*注册*/
    .usBox_2{background:#fff; text-align:left; padding:43px 153px 60px 123px;}
    .usBox_2 .regtitle{height:30px; background:url(images/ur_bg.gif) no-repeat 0px -34px;}
    .actionSub a{color:#006acc; text-decoration:underline;
    background:url(images/ur_bg.gif) no-repeat 0px -68px; padding-left:14px;
    }
    .box_1 .userCenterBox .userMenu a{display:block; height:25px; line-height:25px; background:url(images/menuBg.gif) no-repeat 0 -30px;
    color:#3f3f3f; text-decoration:none; margin:0 0 3px 10px; padding-left:3px;
    }
    .box_1 .userCenterBox .userMenu a.curs{background:url(images/menuBg.gif) no-repeat 0 0px; font-weight:bold;}
    .box_1 .userCenterBox .userMenu a img{ margin-right:3px;}
    .msgBottomBorder{clear:both; background:url(images/lineBg.gif) repeat-x left bottom; padding-bottom:8px; margin-bottom:8px;}

/* ====================
     商品分类页面
==================== */
    /*属性组合搜索*/
		.screeBox{padding:4px;}
		.screeBox a{color:#404040;}
		.screeBox span{background:#91d3f7; padding:3px 5px; margin:0 3px;}
		
    .sort a{ position:relative; bottom:5px;}
    .sort input{position:relative; top:3px;}
    /*商品列表显示方式*/
    .goodsList{ padding:10px 10px 0 10px;}
    .goodsList ul{ margin-bottom:10px;}
    .goodsList ul#bgcolor{background:#fbfbfb; border-top:1px dashed #e8e8e8; border-bottom:1px dashed #e8e8e8;}
    .goodsList li{float:left; padding-top:8px;}
    .goodsList li.thumb{width:80px; text-align:center;}
    .goodsList li.thumb img{width:50px; height:50px; border:1px solid #ccc; padding:1px;}
    .goodsList li.goodsName{width:290px; margin-right:10px;}
    .goodsList li.action{float:right; margin-left:10px;}
    .goodsList li.action a.abg{background:url(images/bg.gif) no-repeat 0px -735px; padding-left:18px; position:relative; bottom:5px;}

/* ====================
     团购
==================== */
    .group{background:#f2f2f2; padding:8px;}
    .group li{float:left; background:#fff; padding:8px;}

/* ====================
     购物流程
==================== */
    .flowBox{border:1px solid #c8e6fe; border-top:2px solid #9fd2ff;}
    .flowBox table{ margin:5px auto;}
		/*2.62在购物车里面显示相关配件*/
		.flowGoodsFittings{padding:10px;}
		.flowGoodsFittings ul{height:1%; margin:5px 4px; float:left;}
    .flowGoodsFittings li{float:left; width:120px;}
    .flowGoodsFittings li.goodsimg{width:48px; margin-right:10px;}
    .flowGoodsFittings li.goodsimg img{width:48px; height:48px; display:block;}
		
/* ====================
     文章列表页-2009.6.8
==================== */
    .article_search{margin:8px 0;}
		.article_search .inputBg{width:300px;}
/* ====================
    打印报价单
==================== */
    .quotation{ margin:20px auto 20px auto; text-align:center;}




   /*翻页*/
   .pagebar{height:20px; float:right;}
   .pagebar img{position:relative; top:2px;}
   .pagebar a{display:block; float:left; margin:0 2px; color:#0066cc; text-decoration:none;}
   .pagebar a:hover{color:#ff5a6a; text-decoration:none;}
   .pagebar .page_now{display:block; float:left; margin:0 5px; color:#ff5a6a; font-weight:bold; background:#fff;}
   #pager a{color:#0066cc; text-decoration:none;}

   /*底部导航+友情链接*/
   #bottomNav{width:1000px;}
   .bNavList{ background:#4fb75e; height:200px; line-height:27px; }
   .links{border:1px solid #fff; background:#eef6f9; padding:0 12px;}
   .bNavList a,.links a{color:#006acd; text-decoration:none;}
   .bNavList img{_position:relative; top:8px;}
   .links img{width:88px; height:30px; margin:5px;}
   
   
   .fixedBox {
position: fixed;
right: 8px;
top: 600px;
width: 70px;
z-index: 8;
}

 #scroll_to_top{height:60px;width:60px;background:url(images/gototop.png) no-repeat;  -moz-transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;}
   

#scroll_to_top:hover{
background:url(images/gototophover.png) no-repeat; 
  transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
}


.help_nav{}


@keyframes bouncing{
  0% {
    transform:  scaleX(1.00) scaleY(1.00) ;
  }
  34% {
    transform:  scaleX(0.80) scaleY(0.80) ;
  }
 
}

@-moz-keyframes bouncing{
  0% {
    -moz-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  34% {
    -moz-transform:  scaleX(0.80) scaleY(0.80) ;
  }
 
}

@-webkit-keyframes bouncing {
  0% {
    -webkit-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  34% {
    -webkit-transform:  scaleX(0.80) scaleY(0.80) ;
  }
 
}

@-o-keyframes bouncing {
  0% {
    -o-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  34% {
    -o-transform:  scaleX(0.80) scaleY(0.80) ;
  }
  
}

@-ms-keyframes bouncing {
  0% {
    -ms-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  34% {
    -ms-transform:  scaleX(0.80) scaleY(0.80) ;
  }
  
}


 
   

   

   
   
   
   
   /*版权*/
   #footer{ width:1000px; margin:10px auto;}
   #footer .text{ *padding-bottom:20px;}
   #footer .text a{color:#404040; text-decoration:none;}


.css-shapes-preview{ 
    position: relative; 
    height: 4px; 
    width: 4px; 
    background-color: #fff; 
    border-radius: 150px; 
}
   .footer_table a {color:#fff;font-family:Microsoft YaHei; -moz-transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;}
   .footer_table a:hover {text-decoration:underline;}

/* ======商品比较浮动块 ====== */
#compareBox {
 width:128px;
 background:url(images/compareBg.gif) no-repeat top center;
 background-color:#edf8ff;
 padding:35px 0 8px 0;
 border: 1px solid #c5e4ff;
 position: absolute;
 right:1px;
 top:200px;
}

#compareBox input {
    width:52px; height:13px;
    border:none;
    background:url(images/compareSub.gif) no-repeat;
}

#compareList {
 margin:0px 0px 8px 0px;
 padding:0px;
 width:120px;
 background:#FFFFFF;
 border:1px solid #d6ecff;
}

#compareList li {
 color: #333;
 text-align:left;
 background: #fff;
 padding: 3px 5px;
 margin: 3px 0;
}

#compareList li img {
 float:right;
 padding-top:4px;
}

/*购物车提示点击更新按钮式样2.6.2版本添加*/
.messageli {
 list-style-type:none;
 padding:5px;
 color:red
}
.messagediv {
 font-size:12px;
 position:absolute;
 border:1px solid #FFD700;
 text-align:center;
 padding:5px;
 background-color:#FFFACD;
 filter:alpha(opacity=50);
 -moz-opacity:0.7;
 opacity: 0.7;
}

/*  积分兑换样式修改 */
.point li{
 float:left;
 width:300px;
}

























/* jssor slider arrow navigator skin 21 css */
            /*
            .jssora21l              (normal)
            .jssora21r              (normal)
            .jssora21l:hover        (normal mouseover)
            .jssora21r:hover        (normal mouseover)
            .jssora21ldn            (mousedown)
            .jssora21rdn            (mousedown)
            */
            .jssora21l, .jssora21r, .jssora21ldn, .jssora21rdn
            {
            	position: absolute;
            	cursor: pointer;
            	display: block;
                background: url(images/a21.png) center center no-repeat;
                overflow: hidden;
            }
            .jssora21l { background-position: -3px -33px; }
            .jssora21r { background-position: -63px -33px; }
			.jssora21l:hover {background-position: -3px -33px;}
            .jssora21r:hover {background-position: -63px -33px;}
            .jssora21ldn {background-position: -3px -33px;}
            .jssora21rdn {background-position: -63px -33px;}
            /*.jssora21l:hover { background-position: -123px -33px; }
            .jssora21r:hover { background-position: -183px -33px; }
            .jssora21ldn { background-position: -243px -33px; }
            .jssora21rdn { background-position: -303px -33px; }*/



#body_mask{
width: 100%;
height: 100%;
z-index:9;
background-color: rgba(0,0,0,.5);
position: absolute;
display:none;
}

#empty_container{
position: fixed;
z-index:10;
top:50%;
left:50%;
}










